<template>
  <scroll-view class="issue-list" scroll-y enable-flex @scrolltolower="loadMore">
    <view class="list-item u-border-bottom" v-for="(item, index) in list" :key="item.issueId" :item="item"
      @click="onClick(item)">
      <view class="list-item-top">
        <view class="title u-line-3">
          <p class="mainTitle u-line-2">
            <span>{{item.issueName}} </span>
            <span class="starLight">·</span>
            <span class="subTitle">{{item.copyIssueName}}</span>
          </p>
          <p class="time u-line-1">{{item.publishTimeDesc}}</p>
        </view>
        <view class="cover" v-if="item.issueCover">
          <image :src="item.issueCover"></image>
        </view>
      </view>
    </view>
    <u-loadmore v-if="list.length>0 || !loaded" class="list-more" :status="moreLoading" :load-text="loadText" />
    <Empty v-if="loaded && list.length<=0" :baseImg="emptyImg" text="暂无相关内容" :fontWeight="400" class="empty" />
  </scroll-view>
</template>

<script>
import Empty from "@/components/Empty.vue";
import { specialIssueList } from "@/api/modules/career";

export default {
  components: {
    Empty,
  },
  props: {
    consultantId: String || Number,
    personId: String || Number, 
  },
  data() {
    return {
      list: [],
      pageParams: {
        pageNo: 1,
        pageSize: 20,
      },
      moreLoading: "loadmore",
      loadText: {
        loadmore: "加载更多",
        loading: "加载中",
        nomore: "已经到底啦",
      },
      loaded: false,
      emptyImg: this.$imgBaseSelf + "common/empty_1.png",
    };
  },
  mounted() {
    this.loadMore();
  },

  watch: {
    // signalObj: {
    //   handler(val) {
    //      console.log("接收到信号");
    //     // this.loadMore();
    //   },
    //   deep: true, // 深度监听
    //   immediate: false, // 初始化的时候立刻执行一次
    // },
  },

  methods: {
    loadMore() {
      console.log("loadMore");
      if (this.moreLoading == "loading" || this.moreLoading == "nomore"){
        console.log("this.moreLoading = "+this.moreLoading);
        return;
      } 

      this.getData(true);
    },
    getData(isMore) {
      const params = {
        pageNo: this.pageParams.pageNo,
        pageSize: this.pageParams.pageSize,
        personId: this.consultantId || 23539031,
      };
     // console.log(params);
      this.moreLoading = "loading";
      specialIssueList(params).then((res) => {
        //console.log(res);
        this.loaded = true;
        this.moreLoading = "loadmore";
        if (res.code == 200) {
          if (isMore) {
            this.list.push(...res.data);
          } else {
            this.list = res.data;
          }

          if (this.pageParams.pageNo >= res.pageparam.pages) {
            this.moreLoading = "nomore";
          }
          this.pageParams.pageNo += 1;
        } else {
          this.moreLoading = "nomore";
          uni.showToast({
            title: res.status_desc,
            icon: "none",
            duration: 2000
          });
        }
      });
    },
    onClick(item) {
      uni.navigateTo({
        url: "/pagesSub/career/careerInfo/publicationDetail?id=" + item.issueId,
      });
    },
  },

  

};
 

</script>

<style lang="scss" scoped>
.issue-list {
  height: 100%;
  padding: 0 32rpx;
  background-color: $uni-bg-color;
  box-sizing: border-box;
  .list-item {
    padding: 24rpx 0 40rpx 0;
    &-top {
      display: flex;
      .title {
        flex: 1;
        height: 100%;
        .mainTitle {
          margin-bottom: 48rpx;
        }
        .starLight {
          margin: 0 0.5em;
        }
        .subTitle {
          // margin-bottom: 28rpx;
          font-size: 32rpx;
        }
        .time {
          color: #bfbfbf;
        }
      }
      .cover {
        margin-left: 54rpx;
        image {
          width: 132rpx;
          height: 132rpx;
          border-radius: 16rpx;
        }
      }
    }
    &-bottom {
      display: flex;
      .cnt-item {
        display: flex;
        align-items: center;
        margin-right: 40rpx;
        color: #bfbfbf;
      }

      .icon {
        width: 32rpx;
        height: 32rpx;
        vertical-align: bottom;
        margin-right: 12rpx;
      }
      .icon-like {
        background-image: url($img-base + "career/thumb.png");
      }
      .icon-like-on {
        background-image: url($img-base + "career/thumb_up.png");
      }
      .icon-comment {
        background-image: url($img-base + "consultant/comment.png");
      }
      .icon-eye {
        background-image: url($img-base + "consultant/eye.png");
      }
    }
  }
}
</style>